@import '../../../styles/tokens.css';

.HeaderToolbarContainer {
  grid-column: 2 / -1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: center;
  gap: var(--space-4);
  width: 100%;

  font-size: var(--font-size-2);
  line-height: var(--line-height-1);
  font-weight: var(--font-weight-1);
}

.HeaderToolbarActions {
  display: flex;
}

.PrimaryActionWrapper {
  flex-grow: 1;
  display: flex;
  gap: var(--space-4);
  justify-content: center;
}
.SecondaryActionWrapper {
  display: flex;
  gap: var(--space-2);
  justify-content: flex-end;
}

.HeaderToolbarContainer.SinglePrimaryAction {
  display: flex;
  justify-content: flex-end;
}

.HeaderToolbarContainer > .DateNavigatorContainer {
  grid-column: 1;
}
.HeaderToolbarContainer > .PrimaryActionWrapper {
  grid-column: 2;
  justify-self: end;
}
